<template>
  <div class="shop-cart-sticky" v-show="visible">
    <!-- sticky 默认为true 复制出来的购物车 -->
    <shop-cart
      ref="shopCart"
      :selectFoods="selectFoods"
      :deliveryPrice="deliveryPrice"
      :minPrice="minPrice"
      :fold="fold"
      :sticky="true"
    ></shop-cart>
  </div>
</template>

<script>
import shopCart from "../shop-cart/shop-cart.vue";
// 引入混合
import pupopMixin from "common/mixins/popup";

export default {
  mixins: [pupopMixin],
  name: "shop-cart-sticky",
  // 调用api时接收这些参数
  props: {
    // 选择商品
    selectFoods: {
      type: Array,
      default() {
        return [];
      }
    },
    // 配送费
    deliveryPrice: {
      type: Number,
      default: 0
    },
    // 送货的最小价格
    minPrice: {
      type: Number,
      default: 0
    },
    // 设置折叠
    fold: {
      type: Boolean,
      default: true
    },
    // 接收的是组件的实例
    list: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  components: { shopCart },
  data() {
    return {
      visible: false
    };
  },
  methods: {
    // show() {
    //   this.visible = true;
    //   // console.log(this.visible);
    // },
    // hide() {
    //   this.visible = false;
    // },
    // 小球的掉落，调用shopcart中的方法
    drop(el) {
      this.$refs.shopCart.drop(el);
    }
  }
};
</script>

<style lang="stylus" scoped>
.shop-cart-sticky
  position: absolute
  left: 0
  bottom: 0
  z-index: 100
  width: 100%
  height: 48px
</style>
